<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>正则</title>
		<style type="text/css">
			code {
				font-size: .875rem;
			}

			.sign::first-letter {
				font-size: 1.25rem;
				font-weight: 600;
			}

			p:not(.sign) {
				display: block;
				text-indent: 2rem;
			}

			p {
				white-space: pre-wrap;
			}
		</style>
	</head>
	<body>
		<a href="../index.html">返回</a>

		<p class="sign">1、 【基本】</p>
		<p>[]与|</p>
		<pre><code class="js">"123456".match(/[1-3]|[456]/g)
//  ["1", "2", "3", "4", "5", "6"]</code></pre>
		<p>[]中的^，表示匹配不在该[]中的字符</p>
		<pre><code class="js">"123456".match(/[^12345]/g)
//  ["6"]</code></pre>

		<p class="sign">2、 【元字符】</p>
		<p>\d 	匹配数字</p>
		<p>\D 	匹配非数字</p>
		<pre><code class="js">"1a2b3c".match(/\d/g)
//  ["1", "2", "3"]</code></pre>
		<p>\s 	匹配空白符</p>
		<p>\S 	匹配非空白符</p>
		<pre><code class="js">"123 4".match(/\d\s\d/g)
//  ["3 4"]</code></pre>
		<p>\b 	匹配单词边界</p>
		<p>\B 	匹配非单词边界</p>
		<pre><code class="js">"1a 2b c3 dd4".match(/[A-z0-9]*\d\b/g)
//  ["c3", "dd4"]</code></pre>
		<p>\w 	数字、子母、下划线</p>
		<p>\W 	非单词字符</p>
		<pre><code class="js">"1a 2b c_3 d*4 e%6 ".match(/\w+\s/g)
//  ["1a ", "2b ", "c_3 ", "4 ", "6 "]</code></pre>
		<p>. 	任意字符，除了换行和行结束符</p>
		<pre><code class="js">"1a &\r2 33\r000".match(/.+/g)
//  ["1a &", "2 33", "000"]</code></pre>

		<p class="sign">3、 【量词】</p>
		<p>+ 	至少一个</p>
		<pre><code class="js">"222".match(/2+/g)
//  ["222"]</code></pre>
		<p>* 	任意个，包含0个</p>
		<pre><code class="js">"222".match(/2*/g)
//  ["222", ""]</code></pre>
		<p>? 	0或1个</p>
		<pre><code class="js">"222".match(/2?/g)
//  ["2", "2", "2", ""]</code></pre>
		<p>{X} 	X个</p>
		<pre><code class="js">"222".match(/2{2}/g)
//  ["22"]</code></pre>
		<p>{X,} 	至少X个</p>
		<p>{X,Y} 	X~Y个</p>
		<pre><code class="js">"222".match(/2{2,}/g)
//  ["222"]
"222".match(/2{1,2}/g)
//  ["22", "2"]</code></pre>

		<p class="sign">4、 【边界量词】</p>
		<p>^ 	开头</p>
		<p>$ 	结尾</p>
		<p>（以一行为单位，如下使用m，进行多行匹配）</p>
		<pre><code class="js">"sta end\ranohter-end".match(/^.*d$/mg)
//  ["sta end", "anohter-end"]</code></pre>

		<p class="sign">5、 【声明量词】（不会返回该量词匹配的东西）</p>
		<p>?=n 	匹配其后紧接着n的字符</p>
		<pre><code class="js">"我A 你B".match(/.(?=A)/g)
//  ["我"]</code></pre>
		<p>(?!n) 	匹配其后没有紧接着n的字符</p>
		<pre><code class="js">"我A 你B".match(/.(?!A)/g)
//  ["A", " ", "你", "B"]</code></pre>

		<p class="sign">6、 【贪婪】</p>
		<p>重复性的匹配默认贪婪模式，尽可能多地匹配</p>
		<pre><code class="js">"111".match(/1{1,}/g)
//  ["111"]</code></pre>
		<p>在其后紧跟 ? ,转为惰性匹配，尽可能少匹配，或者不匹配</p>
		<pre><code class="js">"111".match(/1{1,}?/g)
//  ["1", "1", "1"]</code></pre>

		<p class="sign">7、 【子模式】</p>
		<p>() 	小括号括起来的部分，为一个单独子模式，紧跟其后的量词，对整体起效</p>
		<pre><code class="js">"a=1 bb=2 ccc=3".match(/(\w)*=(\d*)/g)
//  ["a=1", "bb=2", "ccc=3"]</code></pre>

		<p class="sign">8、 【反向引用】</p>
		<p>\1 	"\"符号加数字组成</p>
		<p>\1表示引用第一个子表达式，\2表示引用第二个子表达式，以此类推</p>
		<p>（括号嵌套时，以左括号出现的顺序为准）</p>
		<p>在replace中使用 $1、$2……</p>
		<pre><code class="js">"aba".match(/(a)[^a]*\1/g)
//  ["aba"]</code></pre>
		<p>引用的捕获文本，而不是匹配模式，所以在匹配到文本前是无效的</p>
		<pre><code class="js">"aba".match(/\1(a)[^a]*/g)
//  ["ab", "a"]</code></pre>
		<p>(?:xxx) 	引用占据资源，可以自行禁止</p>
		<pre><code class="js">"aba abb".match(/(?:a)([^a])\1/g)
//  ["abb"]</code></pre>

		<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.1/styles/default.min.css">
		<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.1/highlight.min.js"></script>
		<script>
			hljs.highlightAll();
			console.log("aba abb".match(/(?:a)([^a])\1/g))
		</script>
	</body>
</html>
